import React from "react";
import {Card, Checkbox} from "antd";
import {FuncGroupsProps} from "@/components/FuncBtnGroup/constants";
import FuncBtnGroup from "@/components/FuncBtnGroup";
import "./cardItem.scss";
import StateImg from "@/components/SateImg";

interface CardItemProps {
  data?: any;
  editable: boolean;
}

class CardItem extends React.Component<CardItemProps> {

  renderFuncButtons() {
    const {data} = this.props;
    if (!data) {
      return;
    }

    const funcBtnsProps: FuncGroupsProps = {
      btns: [],
      placement: "topLeft",
      htmlType: "a",
    }

    // funcBtnsProps.btns.push({isPadding: true, key: "padding"});
    // funcBtnsProps.btns.push({isPadding: true, key: "padding"});
    // funcBtnsProps.btns.push({isPadding: true, key: "padding"});
    funcBtnsProps.btns.push({
      key: "mi_remove",
      text: "删除",
      para: [data.id],
      confirmMsg: "确定要删除选中的事件吗？",
      disabled: !!data.tmpMarking,
      // onClick: eventsStore.deleteEvents,
    });

    return FuncBtnGroup(funcBtnsProps);
  }

  renderCover(item?: any) {
    if (!item) {
      return <div/>;
    }
    // const itemMarkingClass = item.tmpMarking ? markingStyles[item.tmpMarking] : undefined;
    const clickProps: any = {};
    // if (!itemMarkingClass) {
    //   clickProps.onClick = eventsStore.checkEventDetail;
    // }

    return (
      <div className="coverImg" key={`cover${item.id}`}>
        <StateImg
          para={item}
          key={`stateImg${item.id}`}
          src={"http://100.100.142.161:9000/devtools/test/pic/20210722110600_2.jpg"}
          scrollDom={window}
          {...clickProps}
          // markingClass={itemMarkingClass}
        />
        {/*{itemMarkingClass ? ("") : (<Checkbox key={`check${item.id}`} value={item.id}/>)}*/}
      </div>
    );
  }

  render() {
    return (
      <Card
        className="card"
        size="small"
        hoverable
        actions={this.renderFuncButtons()}
        cover={this.renderCover(this.props.data)}
      >
        {this.props.children}
      </Card>
    );
  }
}

export default CardItem;
